<template>
    <div class="information">
        <breadcrumb :routes="routes"></breadcrumb>
        <div class="infor-warper">
            <div class="dev-width">
                <div class="infor-title">
                    <span>{{newsType}}</span>
                </div>
                <ul class="infor-list">
                    <li v-for="(item,index) in newsList" :key="index">
                        <nuxt-link :to="{path:`/news/${item.id}`}">
                            {{item.title}}
                        </nuxt-link>
                        <i>{{item.updateTime | formatDate('yyyy-MM-dd')}}</i>
                    </li>
                </ul>
                <div class="infor-page">
                    <mypager :total="total" :rows="page.rows" :current="page.page" @change="change">
                    </mypager>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import portal from "~/net/portal"
import mypager from "~/components/Mypager"
import breadcrumb from '~/components/Breadcrumb'
export default {
    name: "newscatagory",
    data() {
        return {
            newsType: '',
            page: {
                type: 0,
                page: 1,
                rows: 15
            },
            total: 0,
            newsList: []
        }
    },
    components: {
        mypager,
        breadcrumb
    },
    computed: {
        routes() {
            return [
                { name: '首页', path: '/' },
                { name: '资讯', path: '/news' },
                { name: this.newsType }
            ]
        }
    },
    created() {
        if (typeof this.$route.query.id != "undefined") {
            this.page.type = this.$route.query.id;
        }
        if (typeof this.$route.query.name != "undefined") {
            this.newsType = this.$route.query.name;
        }
    },
    asyncData({ query, error, req }) {
        return portal.getPageInformation({
            query: {
                type: query.id,
                rows: 15,
                page: 1
            },
            client: req
        }).then(res => {
            let { code, data, message } = res;
            return {
                newsList: data.rows,
                total: data.total
            }
        }).catch(e => {
            error({ statusCode: 404, messsage: '资讯不存在' })
        });
    },
    methods: {
        change(page) {
            this.page.page = page;
            this.getPageInformation();
        },
        getPageInformation() {
            this.page.rows = 15
            portal.getPageInformation({
                query: this.page
            }).then(res => {
                let { code, data, message } = res;
                if (code === "0000") {
                    this.newsList = data.rows;
                    this.page.total = data.total;
                }
            });
        }
    }
}
</script>
<style>
@import "~/assets/styles/news.css";
</style>